<template>
  <el-card shadow="never">
    <el-row :gutter="20">
      <el-col class="mb20">
        <el-tooltip class="item" effect="dark" content="新增考评方案模板" placement="top">
          <el-button
            size="small"
            class="fr"
            type="primary"
            v-if="$auth('eval:add')"
            @click="handleEdit('add', {})"
            icon="el-icon-plus"
          />
        </el-tooltip>
      </el-col>
      <el-col :span="8">
        <project-small @detail="handleDetail" @edit="handleEdit" ref="projectSmall" />
      </el-col>
      <el-col :span="16">
        <project-big ref="projectBig" />
      </el-col>
    </el-row>
    <project-modal ref="projectModal" @refresh="handleRefresh" />
  </el-card>
</template>

<script>
import ProjectSmall from './ProjectSmall'
import ProjectBig from './ProjectBig'
import ProjectModal from './ProjectModal'
export default {
  components: {
    ProjectSmall,
    ProjectBig,
    ProjectModal
  },
  methods: {
    handleEdit(type, row) {
      this.$refs.projectModal.edit(type, row)
    },
    handleRefresh() {
      this.$refs.projectSmall.handleGetList()
    },
    // 点击左边获取右边详情
    handleDetail(row) {
      this.$refs.projectBig.detail(row)
    }
  }
}
</script>

<style>
</style>